<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <script type="text/javascript" src="../../js/vue.js"></script>
</head>
<body>
<!--需求,打开页面展示一个闪烁的文字,通过透明度的值来实现闪烁-->
  <div id="root">
    <h2 :style="{opacity}">欢迎来到Vue</h2>
  </div>

  <script type="text/javascript">
    var vm = new Vue({
      el:'#root',
      data:{
        opacity:1
      },
      mounted(){
        //mounte函数,在真实dom挂载完成到页面后调用,通过定时器来修改透明度的css值
        setInterval(()=>{
          this.opacity-=0.005
          if(this.opacity <=0){
            this.opacity = 1
          }
        })
      }
    },1);
  </script>
</body>
</html>
